<!DOCTYPE html>
<html>
    <head>
        <title>{% block title %}{{ global.title }}{% endblock %}</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
        <style>
        * { box-sizing: border-box; }
        html, h1, h2, h3, h4 { margin:0; padding:0; }
        ul, ol { margin-left:0; list-style: none; text-align:center; }
        a { text-decoration:none; color:#333; border:none; outline: none; }
        img { border:none; }
        form, table { margin:0px; padding:0; }
        body, #body { margin: 0 auto; max-width: 480px; min-height: 400px; box-sizing: border-box; }
        body, h1, h2, h3, h4, a { font-family: 'MHeiPRC-Bold', '微软雅黑', 'Microsoft YaHei'; }
        
        .clearfix:before, .clearfix:after {content: " ";display: table; clear: both; }
        .unselectable {
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            -khtml-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            -o-user-select: none;
            user-select: none;
        }
        input, button { -webkit-appearance: none; background: none; padding: 0; outline-style:none; border: none; }
        #body { position: relative; }
        .overlay { 
            display: none;
            background-color: rgba(3, 3, 3, 0.70);
            position: absolute; top: 0; left: 0;
            width: 100%; height: 100%;
            padding-top: 10px; z-index: 100;
            text-align: center;
        }
        .logo { bottom: 0; position: fixed; width: 100%; }
        </style>
        {% block stylesheets %}{% endblock %}
    </head>
    <body>
        <!-- first 200x200 will be shared -->
        <div style="position: absolute; top: -999px; display: none;"><img src="{{ global.wxshare.img }}" /></div>
        
        <div id='body'>
        {% block body %}
        
        {% endblock %}
        </div>
        
        {{ js('js/jquery-1.9.1.min.js') }}
        {{ js('js/velocity.min.js') }}
        <script src='http://res.wx.qq.com/open/js/jweixin-1.0.0.js'></script>
        <script>
            // screen sized
            var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
            var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
            
            var lineLink = '{{ app.config('base_url')|raw }}';
            var imgUrl = '{{ global.wxshare.img }}';
            var shareTitle = '{{ global.wxshare.title }}';
            var shareContent = '苏宁打狗';
            var timelineContent = '{{ global.wxshare.content }}';
            var timelinelink = lineLink;
        </script>
        {% block javascripts %}
        {% endblock %}
        {% if signPackage is defined %}
        <script>
            wx.config({
                debug: false,
                appId: '{{ signPackage.appId }}',
                timestamp: {{ signPackage.timestamp }},
                nonceStr: '{{ signPackage.nonceStr }}',
                signature: '{{ signPackage.signature }}',
                jsApiList: [
                    'onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'showMenuItems', 'hideMenuItems'
                ]
            });
            wx.ready(function () {
                wx.showMenuItems({
                    menuList: [
                        'menuItem:share:appMessage',
                        'menuItem:share:timeline',
                        'menuItem:share:weiboApp',
                        'menuItem:share:qq'
                    ]
                });
                wx.hideMenuItems({
                    menuList: [
                        'menuItem:share:facebook',
                        'menuItem:openWithSafari',
                        'menuItem:share:email',
                        'menuItem:setFont',
                        'menuItem:copyUrl',
                        'menuItem:exposeArticle'
                    ]
                });
                
                wx.onMenuShareAppMessage({
                    title: shareTitle,
                    desc: shareContent,
                    link: lineLink,
                    imgUrl: imgUrl,
                    success: function () { 
                        // 用户确认分享后执行的回调函数
                    },
                    cancel: function () { 
                        // 用户取消分享后执行的回调函数
                    }
                });
                wx.onMenuShareTimeline({
                    title: timelineContent, // 分享标题
                    link: timelinelink, // 分享链接
                    imgUrl: imgUrl, // 分享图标
                    success: function () { 
                        // 用户确认分享后执行的回调函数
                    },
                    cancel: function () { 
                        // 用户取消分享后执行的回调函数
                    }
                });
                wx.onMenuShareQQ({
                    title: shareTitle,
                    desc: shareContent,
                    link: lineLink,
                    imgUrl: imgUrl,
                    success: function () { 
                        // 用户确认分享后执行的回调函数
                    },
                    cancel: function () { 
                        // 用户取消分享后执行的回调函数
                    }
                });
                wx.onMenuShareWeibo({
                    title: shareTitle,
                    desc: shareContent,
                    link: lineLink,
                    imgUrl: imgUrl,
                    success: function () { 
                        // 用户确认分享后执行的回调函数
                    },
                    cancel: function () { 
                        // 用户取消分享后执行的回调函数
                    }
                });
            });
            {% endif %}
        </script>
    </body>
</html>
